// clock.js
// 在组件的 js 文件中
const appInstance = getApp();
Component({
  properties: {
    // 可以定义一些组件的属性
  },
  data: {
    // 组件的初始数据
    time: '',
    hours: '00',
    minutes: '00',
    seconds: '00',
    circleStyle: '', // 用于存储圆形元素样式的数据绑定
  },
  lifetimes:{
    // 在组件实例刚刚被创建时执行
    ready: function() {
      console.log('aaa');
      console.log(appInstance.globalData.capsule);
      let capsule = appInstance.globalData.capsule
      let navBarHeight = appInstance.globalData.navBarHeight
      let statusBarHeight = appInstance.globalData.statusBarHeight
      console.log(navBarHeight);
      this.setData({
        // 设置圆形 DOM 的样式 // 设置圆形 DOM 的样式，使其右侧与胶囊按钮右侧有 5rpx 的距离
        // circleStyle: `width: ${capsule.height}px; height: ${capsule.height}px; top: ${0 - statusBarHeight - navBarHeight}px; left: ${capsule.right - 5 - capsule.height - capsule.height}px; position: fixed; border-radius: 50%;` 
        circleStyle: `width: ${capsule.height}px; height: ${capsule.height}px; bottom: ${0 - statusBarHeight - navBarHeight}px; right: ${5}px; position: fixed; border-radius: 50%;` 
      });
    },

  },
  // onReady: function() {
  //   // 获取胶囊按钮位置信息
  //   console.log('capsule.height');
  //   const capsule = wx.getMenuButtonBoundingClientRect();
  //   console.log(capsule.height);
  //   console.log(capsule.top); 
  //   this.setData({
  //     // 设置圆形 DOM 的样式
  //     circleStyle: `width: ${capsule.height}px; height: ${capsule.height}px; top: ${capsule.top}px; right: 5rpx; position: fixed; border-radius: 50%; background-color: #FF0000;` // 样式根据实际需求设定
  //   });
  // },
  methods: {
    updateTime() {
      const now = new Date();
      const hours = String(now.getHours()).padStart(2, '0');
      const minutes = String(now.getMinutes()).padStart(2, '0');
      const seconds = String(now.getSeconds()).padStart(2, '0');
      this.setData({
        hours,
        minutes,
        seconds
      });
    }
  },
  attached() {
    // 在组件实例进入页面节点树时执行
    this.updateTime();
    this.interval = setInterval(() => this.updateTime(), 1000);
  },
  detached() {
    // 在组件实例被从页面节点树移除时执行
    clearInterval(this.interval);
  }
});
